<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">

    <!-- <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport"/> -->
    <meta content="yes" name="apple-mobile-web-app-capable"/>
    <meta content="black" name="apple-mobile-web-app-status-bar-style"/>
    <meta content="telephone=no" name="format-detection"/>
    <link href="../../../css/style_login.css" rel="stylesheet" type="text/css"/>



    <title>我的粉丝</title>
    <link rel="stylesheet" type="text/css" href="../../../css/api.css"/>
    <!-- <link rel="stylesheet" type="text/css" href="../../css/style.css"/> -->
    <link rel="stylesheet" type="text/css" href="../../../css/aui.css" />

    <style>

        html,body {
        height: 100%;
        background-color: #fff;
        }

        header{
            height: 40px;
            width: auto;
            background-color: white;
            display: -webkit-box;
            -webkit-box-orient: horizontal;
            -webkit-box-align: center;


        }

        .backicon {
            width: 20px;
            height: 20px;
            display: block;
            border: none;
            float: left;
            background-size: 20px;
            background-repeat: no-repeat;

            margin: 10px 20px;
            opacity: 0.9;
            background-image:  url('');
            /*background-image:  url('bottombtn0101.png')*/
        }
        .tv_follow{
            font-size: 20px;
        }


    </style>
    <!-- <script type="text/javascript" src="../.../script/doT.min.js"></script> -->

</head>
<script type="text/javascript" src="../../script/api.js"></script>
<!-- <script type="text/javascript" src="../../script/template.js"></script> -->
<script type="text/javascript" src="../../script/doT.min.js"></script>
<script type="text/javascript" src="../../script/doT.js"></script>

<script>

    apiready = function() {

        setFollowList();
    }

    function setFollowList(){
        var flag1 = $api.byId('flagu');

        //var htmlcontent=" <li class=\"aui-list-item\" style=\"padding-top:20px; padding-bottom:20px;\"><div class=\"aui-list-item-label-icon\"><i class=\"aui-iconfont aui-icon-home\"></i></div><div class=\"aui-list-item-inner\"><div>{{username}}#username#<br>UI问题优秀回答者</div></div><div class=\"aui-list-item-right\" ><div class=\"aui-btn\" style=\" margin-top: 10px; margin-right:24px;\">已关注</div></div></li>"

        // 1. 编译模板函数
        // var tempFn = doT.template("<h1>Here is a sample template {{=it.foo}}</h1>");
        // // 2. 多次使用模板函数
        // var resultText = tempFn({foo: 'with doT'});
        // $api.html(flag1, resultText);

        //var r=template(htmlcontent, values)

        //var list = $api.byId('list');

        // 编译模板函数
        var tempFn = doT.template($api.byId('template').innerHTML);
        //$api.html(flag1, "resultHTM L");

        // 使用模板函数生成HTML文本
        var data_=[{"username":"banana","des":"描述1"},{"username":"bs","des":"描述1"},{"username":"username","des":"描22"},{"username":"banafsna","des":"ddd"},{"username":"banadfna","des":"描述fd1"}];



        var resultHTML = tempFn(data_);
        $api.html(flag1, resultHTML);

        //$api.html(flag1,r);

        //
        // var data = {
        //  title: '嵌入子模板',
        //  list: ['文艺', '博客', '摄影', '电影', '民谣', '旅行', '吉他']
        // };
        // var html = template('test', data);
        // document.getElementById('content').innerHTML = html;


        api.ajax({
            url: 'https://api.yazhuaa/Login',
            timeout: 1,
            dataType: 'json',
            data:{
                values:{
                    "username": "name",

                },   //以表单方式提交参数（JSON对象）
                method: 'post',
                // tag:'setFollowList'
            }
        },function(ret, err) {
            // api.hideProgress();
            return;

            /*** 登录异常 ***/
            if (err) {
                api.toast({
          　　　　　　msg:'网络异常，请稍后重试',
          　　　　　　duration: '1300',
          　　　　　　localtion: 'middle'
        　　　　 });
                return;
            }
    //
    //         if(ret.data.result == false){
    //             api.toast({
    //             　　msg: '获取失败',
    //             　　duration: 1000,
    //             　　location: 'middle'
    //       　　    });
    //
    //     　　}else{
    //             var res =ret.data.result;
    //             for (let i = 0;i < res.length;i++){
    //                console.log(res[i].username);  // a  b  c
    //             }
    //
    //             // if (ret.data.result.user_name) $api.setStorage('username', ret.data.result.user_name);
    //             // if (ret.data.result.id) $api.setStorage('id', ret.data.result.id);
    //             // if (ret.data.result.member_id) $api.setStorage('member_id', ret.data.result.member_id);
    //             // if (ret.data.sessionid) $api.setStorage('PHPSESSID', ret.data.sessionid);
    //
    // //             api.toast({
    // //     　　　　　　msg:'登录成功',
    // //     　　　　　　duration: '1200',
    // //     　　　　　　localtion: 'middle'
    // //   　　　　　　});
    // //             $api.setStorage('isLogin', true);
    //                 // api.sendEvent({
    //                 //     name: 'UserHasLogin'
    //                 // });
    //             //     setTimeout(function() {
    //             //         api.openWin({
    //             //     　　　　name: 'index',
    //             //    　　　　 url: '../../../index.html',
    //             //     　　　　bounces: false,
    //             //    　　　　 animation:{
    //             //         　　　　type: "push",
    //             //         　　　　duration:300
    //             //     　　　　}
    //             // 　　　　});
    //             //     }, 1000);
    //         }
    //         }
        });



        }


</script>

<body>


    <ul class="aui-list aui-list-in aui-content" id="flagu">
        <li class="aui-list-item" style="padding-top:20px; padding-bottom:20px;background-color:#d8d8d8">
            <div class="aui-list-item-label-icon">
                <i class="aui-iconfont aui-icon-home"></i>
            </div>

            <div class="aui-list-item-inner">
                <div class="">
                    这是一个列表项<br>
                    UI问题优秀回答者
                </div>
            </div>


            <div class="aui-list-item-right" >
                <div class="aui-btn" style=" margin-top: 10px; margin-right:24px;">已关注</div>
            </div>
        </li>

        <li class="aui-list-item" style="padding-top:20px; padding-bottom:20px;">
            <div class="aui-list-item-label-icon">
                <i class="aui-iconfont aui-icon-home"></i>
            </div>

            <div class="aui-list-item-inner">
                <div class="">
                    这是一个列表项<br>
                    UI问题优秀回答者
                </div>
            </div>


            <div class="aui-list-item-right" >
                <div class="aui-btn" style=" margin-top: 10px; margin-right:24px;">已关注</div>
            </div>
        </li>

        <div  id="flag"></div>

    </ul>




</body>

<script type="text/template" id="template">

    {{~it:value:index}}
    <li class="aui-list-item" style="padding:20px;padding-bottom:20px;background-color:#f9f9f9">
        <div class="aui-list-item-label-icon">
            <i class="aui-iconfont aui-icon-home"></i>
        </div>

        <div class="aui-list-item-inner">
            <div class="">
                {{=value.username}}<br>
                UI问题优秀回答者
                {{=index}}
            </div>
        </div>


        <div class="aui-list-item-right" >
            <div class="aui-btn" style=" margin-top: 10px; margin-right:10px; background-color:#5f77ff; color:white;">已关注</div>
        </div>
    </li>

    {{~}}
</script>




</html>
